<template>
  <div>
    <van-field
      v-model="password"
      center
      clearable
      placeholder="请输入密码"
    >
    </van-field>
    <p>最少为6为，至少包含一个大写字母，1个小写字母，1个数字</p>
    <van-button @click="register" :disabled="flag" round class="btn" block color="#ff6666">下一步</van-button>
  </div>
</template>

<script>
import Vue from 'vue'
import { NavBar, Field, Button, Dialog } from 'vant'
import { dofinishregister } from './../../api/user'
Vue.use(NavBar)
Vue.use(Field)
Vue.use(Button)
Vue.use(Dialog)
export default {
  data () {
    return {
      password: ''
    }
  },
  computed: {
    flag () {
      return !/^\S*(?=\S{6,})(?=\S*\d)(?=\S*[A-Z])(?=\S*[a-z])\S*$/.test(this.password)
    }
  },
  methods: {
    register () {
      dofinishregister({
        tel: localStorage.getItem('tel'),
        password: this.password
      }).then(res => {
        Dialog.confirm({
          message: '注册成功，登录手机号为<br/>' + localStorage.getItem('tel')
        })
          .then(() => {
            // on confirm
            this.$router.go(-3) // ? replace
          })
          .catch(() => {
            // on cancel
          })
      })
    }
  }
}
</script>

<style lang="stylus" scoped>
.content
  padding 30px 20px
  .btn
    margin-top 40px
</style>
